<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./templates/template_home.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core">

    <ui:define name="title">
        Accueil
    </ui:define>

    <ui:define name="a_propos">
        <div class="main_text_box">
            <h2>Actualités</h2>
            <p>
                <center><h3>Essayer notre application Android !</h3></center><br/>


                <p:lightBox>
                    <h:outputLink value="#" style="text-decoration: none;">
                        <center><p:graphicImage value="./resources/images/android.gif" width="160px"/></center>
                    </h:outputLink>
                    <br/><br/>
                    <div style="text-align: justify;">Grace à notre application vous pourrez consulter le contenu de TheCityRater sur votre téléphone, être avertis
                        des dernières actualités de vos lieux favoris et partager avec vos amis vos positions.<br/><br/>
                        Pour cela télécharger TheCityRater sur Android Market.</div><br/><br/>
                    <div style="text-align: right; font-style: italic;"> TheCityRater Team </div>
                    
                    <f:facet name="inline">  
                        <h:panelGrid columns="1">
                            <h:form>
                                <h:outputLabel style="color: white;" value="En développement"/><br/>
                                <p:graphicImage value="./resources/images/android_3d.gif" width="320px"/>
                            </h:form>
                        </h:panelGrid>  
                    </f:facet>  
                </p:lightBox>
            </p>
        </div>

    </ui:define>

    <ui:define name="enseignes_recentes">
        <div class="small_title">Enseignes récentes</div> 

        <h:form prependId="false">  
            <p:dataGrid var="enseigne_recente" styleClass="datagrid_recent2enseigne" value="#{enseigneMBean.recent2Enseigne}" columns="1"  
                        rows="2" paginator="false" paginatorTemplate="{CurrentPageReport} {FirstPageLink}
                        {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}
                        {RowsPerPageDropdown}" rowsPerPageTemplate="10,50,100">
                <p:column>
                    <p:panel header="#{enseigne_recente.nom}" style="text-align:center;width: 310px">  
                        <h:panelGrid columns="2" style="width:100%">
                            <p:commandLink action="#{enseigneMBean.detailEnseigne(enseigne_recente)}" title="Visualiser">
                                <p:graphicImage value="./resources/images/enseignes_img/#{enseigne_recente.imageProfil}" width="150px"/>
                            </p:commandLink>
                            <h:outputText value="#{enseigne_recente.description}"/>
                            <h:panelGrid columns="2">
                                <h:outputText value="Ajoutée le : "/>
                                <h:outputText value="#{enseigne_recente.dateCreation}">
                                    <f:convertDateTime type="date" dateStyle="short" locale="fr" />
                                </h:outputText>
                            </h:panelGrid>
                        </h:panelGrid>
                    </p:panel>  
                </p:column>
            </p:dataGrid>  
        </h:form>
    </ui:define>

    <ui:define name="top_enseignes">
        <div class="title">Meilleurs enseignes</div>

        <h:form prependId="false">  
            <p:dataGrid var="enseigne_top" styleClass="datagrid_top4enseigne" value="#{enseigneMBean.top4Enseigne}" columns="2"  
                        rows="12" paginator="false" paginatorTemplate="{CurrentPageReport} {FirstPageLink}
                        {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}
                        {RowsPerPageDropdown}" rowsPerPageTemplate="10,50,100">
                <p:column>
                    <p:panel header="#{enseigne_top.nom}" style="text-align:center;width: 310px">  
                        <h:panelGrid columns="2" style="width:100%">
                            <p:commandLink action="#{enseigneMBean.detailEnseigne(enseigne_top)}" title="Visualiser">
                                <p:graphicImage value="./resources/images/enseignes_img/#{enseigne_top.imageProfil}" width="150px"/>
                            </p:commandLink>
                            <h:outputText value="#{enseigne_top.description}"/>
                            <h:panelGrid columns="2">
                                <h:panelGroup>
                                    <p:rating disabled="true" value="#{enseigne_top.note}"/>
                                    <h:outputText value="(#{enseigne_top.notes.size()})"/>
                                </h:panelGroup>
                            </h:panelGrid>
                        </h:panelGrid>
                    </p:panel>  
                </p:column>
            </p:dataGrid>  
        </h:form>
    </ui:define>

</ui:composition>
